<template>
	<view>
		<view class="list-cell-wrap">
			<list-cell hover arrow @tap="jump('/pages/user/edit-info/edit?type=edit')">
				<view class="list-cell-wrapper">
					<view view="title">编辑资料</view>
					<view class="subtitle"></view>
				</view>
			</list-cell>
			<list-cell hover arrow @tap="jump('/pages/my/contact')">
				<view class="list-cell-wrapper">
					<view view="title">联系方式</view>
					<view class="subtitle">
						<text></text>
					</view>
				</view>
			</list-cell>
		</view>
		<view class="list-cell-wrap">
			<list-cell hover arrow>
				<view class="list-cell-wrapper">
					<view view="title">手机号码</view>
					<view class="subtitle">{{userInfo.mobile}}</view>
				</view>
			</list-cell>
			<list-cell hover arrow>
				<view class="list-cell-wrapper">
					<view view="title">通知与提醒</view>
					<view class="subtitle"></view>
				</view>
			</list-cell>
		</view>
		<view class="list-cell-wrap">
			<list-cell hover arrow>
				<view class="list-cell-wrapper">
					<view view="title">意见反馈</view>
					<view class="subtitle"></view>
				</view>
			</list-cell>
		</view>
		<view class="p-20">
			<button class="border-radius-base" type="warn" @tap="loginOut">退出登陆</button>
		</view>
	</view>
</template>

<script>
import {mapState, mapMutations } from 'vuex'
export default {
	computed:{
		...mapState(['hasLogin', 'userInfo']),
	},

	data() {
		return {
			
		};
	},
	methods: {
		...mapMutations(['setLogin', 'setUserInfo']),
		jump(url) {
			uni.navigateTo({
				url:url
			})
		},
		loginOut() {
			let that = this;
			uni.showModal({
				title: '提示',
				content: '确定退出登陆吗？',
				confirmText:'确定',
				success (res) {
					that.setLogin(false);
					uni.removeStorageSync("token");
					uni.removeStorageSync("userInfo");
					uni.switchTab({
						url: "/pages/index/index"
					})
				}
			})
			
		}
	}
};
</script>

<style lang="scss" scoped>
.list-cell-wrap {
	background-color: #fff;
	margin: 20rpx 0;
	overflow: hidden;
}
.list-cell-wrapper {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	
	.title {
		font-size: 32rpx;
	}
	
	.subtitle {
		font-size: 24rpx;
		color: #999999;
	}
}
</style>
